import React, { useCallback, useState } from 'react';
import * as Sentry from "@sentry/react";
import { Link } from 'react-router-dom';

function App() {
  const [test, setTest] = useState(1)
  const [error, setError] = useState(false)


  const handelError = useCallback(() => {
    if (test > 2) {
      (window as any).test33333()
    }
  }, [test])

  const handleDo = useCallback(async () => {
    await fetch('http://localhost:3000/static/js/vendors~main.chunk.js')
    setTest((pre: number) => pre + 1)
  }, [])

  const captureMessage = () => {
    Sentry.captureMessage("Something went wrong");
  }
  return (
    <div className="App">
      <div>
        {error && new Error('error')}
        <button onClick={() => setError(true)}>set error</button>
        <div>
          <Link to="/about">go about</Link>
        </div>
        <button id="test" onClick={handleDo} >新增test {test}</button>
      </div>
      <button id="error" onClick={handelError} >创建一个error</button>
      <button id="error" onClick={captureMessage} >captureMessage</button>

    </div>
  );
}

export default App